<template>
  <!-- 添加个人信息 -->
  <el-dialog
    class="add-store-dialog"
    :title="title"
    :visible.sync="addVisible"
    width="30%"
  >
    <div class="store-body">
      <el-form
        ref="storeFormRef"
        :rules="rules"
        :model="storeForm"
        label-width="140px"
      >
        <el-form-item prop="content" label="公告内容">
          <el-input v-model="storeForm.content"></el-input>
        </el-form-item>
        <el-form-item prop="image_url" label="公告图片在线地址">
          <el-input v-model="storeForm.image_url"></el-input>
        </el-form-item>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="confirm">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { addNotice } from "@/api/noval.js";
export default {
  name: "AddDialog",
  components: {},
  props: {
    visible: {
      default: false,
      type: Boolean,
    },
    storeData: {
      type: Object,
      default: {},
    },
    title: {
      type: String,
      default: "公告录入",
    },
  },
  data() {
    return {
      dialogImageUrl: "",
      dialogVisible: false,
      disabled: false,
      //表单
      storeForm: {
        username: null,
        password: null,
        nickname: null,
        email: null,
        user_pic: null,
        realName: null,
        age: null,
        phone: null,
        idNumber: null,
        createTime: null,
        endTime: null,
        examTime: null,
        examScore: null,
      },
      rules: {
        content: [
          {
            required: true,
            message: "请输入公告内容",
            trigger: "blur",
          },
        ],
        image_url: [
          {
            required: true,
            message: "请输入公告图片地址",
            trigger: "blur",
          },
        ],
      },
    };
  },
  watch: {},
  created() {},
  mounted() {
    if (this.title !== "公告录入") {
      this.handleEditInfo();
    }
  },
  computed: {
    addVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
  },
  methods: {
    cancel() {
      this.$refs.storeFormRef.resetFields();
      this.addVisible = false;
    },
    handleEditInfo() {
      this.storeForm = this.storeData;
    },
    confirm() {
      this.$refs.storeFormRef.validate(async (valid) => {
        if (valid) {
          if (this.title === "公告录入") {
            const data = {
              content: this.storeForm.content,
              image_url: this.storeForm.image_url,
            };
            const res = await addNotice(data);
            if (res?.status === 0) {
              this.$message.success(res.message);
              this.$emit("confirm");
              this.addVisible = false;
            } else {
              this.$message.error(res.message);
            }
          } else {
            // //编辑公告信息
            // if (!this.storeForm?.id)
            //   return this.$message.warning("无id，请选择要编辑的信息!");
            // const res = await updateInfo(this.storeForm);
            // if (res?.status === 0) {
            //   this.$message.success(res.message);
            //   this.$emit("confirm");
            //   this.addVisible = false;
            // } else {
            //   this.$message.error(res.message);
            // }
          }
        } else {
          console.log("错误提交！请重试！");
          return false;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.el-input {
  width: 220px;
}
.el-form {
  display: flex;
  flex-wrap: wrap;
}
.flex-per50 {
  width: 50%;
}
</style>
